var t_width = $("#plogw").attr("width");

var cell_data = [
  ["2019", 111, 2, 3, 4, 6, 7, 8, 9, 10, 11, 12, 13, 14],
  ["2018", 1, 2, 3, 4, 6, 7, 8, 9, 10, 11, 12, 13, 14],
  ["2017", 1, 2, 3, 4, 6, 7, 8, 9, 10, 11, 12, 13, 14],
  ["2016", 1, 2, 322.5, 4, 6, 7, 8, 9, 10, 11, 12, 13, 14],
];

cell_data.unshift(["", "01月", "02月", "03月", "04月", "05月", "06月", "07月", "08月", "09月", "10月", "11月", "12月", "合计"])

var firstRowRenderer = function (instance, td, row, col, prop, value, cellProperties) {
  Handsontable.renderers.TextRenderer.apply(this, arguments);
  $(td).css("color", "#797979");
  $(td).css("background-color", "#eee");
};

var firstColRenderer = function (instance, td, row, col, prop, value, cellProperties) {
  Handsontable.renderers.TextRenderer.apply(this, arguments);
  $(td).css("width", "200px");
  $(td).css("color", "#797979");
  $(td).css("background-color", "#eee");
};

var dhoursColRenderer = function (instance, td, row, col, prop, value, cellProperties) {
  Handsontable.renderers.TextRenderer.apply(this, arguments);
  if (value > 199) {
    $(td).css("color", "#FF6C60");
  }
};

var container = document.getElementById('prodlogtable');
hot = new Handsontable(container, {
  data: cell_data, //导入数据
  rowHeaders: false,
  colHeaders: false,
  fixedRowsTop: 1,
  fixedColumnsLeft: 1,
  className: "htCenter htMiddle",
  width: t_width, //表宽 多余自动显示滚动条
  height: 400,//表高
  language: 'zh-CN',
  rowHeights: 40,
  // colWidths: 75,
  cells: function (row, col, prop) {//单元格渲染
    var cellProperties = {};
    if (row === 0) {
      cellProperties.renderer = firstRowRenderer;//调用首行渲染方法 
    }
    if (col === 0) {
      cellProperties.renderer = firstColRenderer;//调用首列渲染方法 
    }
    if (row < cell_data.length) {
      cellProperties.readOnly = true;
    }
    if (row !== 0 && col !== 0) {
      this.renderer = dhoursColRenderer;
    }
    return cellProperties;
  },
});